import "./App.css";
import {Outlet, useNavigate} from "react-router";
import {Avatar, Dropdown, Input, InputValue} from "tdesign-react"
import {useEffect, useState} from "react";

function App() {
  // const [greetMsg, setGreetMsg] = useState("");
  // const [name, setName] = useState("");

  // async function greet() {
  //   // Learn more about Tauri commands at https://tauri.app/v1/guides/features/command
  //   setGreetMsg(await invoke("greet", { name }));
  // }
  const [value,set_value] = useState<string>("")
  const navigate = useNavigate();
  useEffect(() => {
      navigate("/home")
  },[])

  const enter = (value: InputValue) => {
    if (value.startsWith("/")){
        navigate(value)
        set_value("")
    }
  }

  const change = (value: InputValue) => {
    set_value(value)
  }

  return (
    <div className="container">
        <div className="navbar">
            <div className="navbar-left"></div>
            <Input placeholder="/TCODE..." onChange={change} className="navbar-input" value={value} onEnter={enter}/>
            <div className="navbar-mid"></div>
            <div className="navbar-right">
                <Dropdown
                    options={[{
                        content: "个人中心",
                        value: 1,
                        onClick: () => navigate("/userCenter")
                    }]}
                >
                    <Avatar
                        image="https://cdn-img.gitcode.com/fb/ac/024f48409ba0c8bccddf115dcece7d020b80a480ac1e1c7247a33561b52a752a.png?time=1754123448981"
                        shape="circle"
                    />
                </Dropdown>

            </div>
        </div>
        <Outlet/>
    </div>
  );
}

export default App;
